<template>
    <el-table
        class="table-small text-ellipsis"
        ref="table"
        border
        :data="data"
        @row-dblclick="handleEdit"
        @row-click="handleTbClick"
        @selection-change="handleSelection"
    >
        <el-table-column align="center" type="selection" width="45"></el-table-column>
        <el-table-column align="center" prop="declareNo" label="内部编号"></el-table-column>
        <el-table-column align="center" prop="businessStatusName" label="状态"></el-table-column>
        <el-table-column align="center" prop="tradeModeName" label="监管方式"></el-table-column>
        <el-table-column align="center" prop="tradeName" label="收发货人名称"></el-table-column>
        <el-table-column align="center" label="报关单号">
            <template slot-scope="scope">{{scope.row.entryId || scope.row.seqNo || ''}}</template>
        </el-table-column>
        <el-table-column align="center" prop="createTime" label="创建时间"></el-table-column>
        <el-table-column align="center" label="操作" :width="80" fixed="right">
            <template slot-scope="scope">
                <div class="table-action" @click.stop @dblclick.stop>
                    <i
                        class="table-icon t-edit-icon"
                        :class="{disabled: editDisabled}"
                        :title="editDisabled ? '无权限' : '编辑'"
                        @click="handleEdit(scope.row)"
                    ></i>
                    <i
                        class="table-icon t-setting-icon"
                        title="更多操作"
                        @click="handleMore($event, scope.row)"
                    ></i>
                </div>
            </template>
        </el-table-column>
    </el-table>
</template>
<script>
export default {
    props: {
        data: {
            default: () => [],
            type: Array
        },
        editDisabled: {
            type: Boolean,
            default: false
        },
        viewDisabled: {
            type: Boolean,
            default: false
        }
    },
    methods: {
        handleEdit (row) {
            if (this.editDisabled) return
            this.$emit('editEvent', row)
        },
        handleView (row) {
            if (this.editDisabled) return
            this.$emit('viewEvent', row)
        },
        handleMore ($event, row) {
            this.$emit('moreEvent', $event, row)
        },
        handleTbClick (row) {
            this.$refs.table.toggleRowSelection(row)
        },
        handleSelection (list) {
            this.$emit('selection-change', list)
        }
    }
}
</script>
<style scoped>
.text-ellipsis >>> .cell {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 1.5;
}
</style>
